<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="_layout/top :: top"></head>
<body>
<div id="page-wrapper">
    <header th:replace="_layout/header :: header"></header>
        <!-- Breadcrumb Start -->
        <div class="page-banner-image w-100 breadcrumb-bar" style="background-image: url(static/assets/images/background/1.png); background-repeat: no-repeat;">
            <div class="container">
                <div class="row py-5">
                    <div class="col-sm-6">
                        <h3 class="text-white">Our Offers</h3>
                    </div>
                    <div class="col-sm-6">
                        <nav aria-label="breadcrumb" class="float-right">
                            <ol class="breadcrumb mb-0 bg-transparent p-0 mt-2 mt-lg-1">
                                <li class="breadcrumb-item"><a href="#">Home</a></li>
                                <li class="breadcrumb-item"><a href="#">Pages</a></li>
                                <li class="breadcrumb-item active" aria-current="page">Offers</li>
                            </ol>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    <!-- Breadcrumb End -->


    <div class="full-row bg-light pb-0">
        <div class="container">
            <div class="row">
                <div class="col-md-6 d-none d-md-block pr-0">
                    <div class="w-100 h-100 position-relative" style="background-image: url(static/assets/images/thumb/height1.jpg); background-size: cover; background-position: center center;">
                        <span class="p-4 position-absolute bg-primary text-center box-100px d-table top-0 right-0"><i class="fas fa-house-damage text-white fa-3x"></i></span>
                    </div>
                </div>
                <div class="col-md-6 pl-md-0">
                    <div class="bg-secondary text-light h-100 sm-p-30 p-5">
                        <h2 class="text-white mb-3">Start Selling Car From Home</h2>
                        <div class="text-general font-large mb-4 text-white">Starting at <span class="text-primary h3">$99.99</span>/ month</div>
                        <p>Arcu facilisis ante natoque a. Sapien justo tempus quam lectus porttitor ornare tristique enim sociosqu montes tellus duis nulla suscipit ultrices. Eget maecenas pretium sollicitudin auctor adipiscing elit. Elementum faucibus.</p>
                        <a href="offer-details.html" class="btn btn-primary">Offer Details</a>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="full-row bg-white pb-0">
        <div class="container">
            <div class="row">
                <div class="col-md-6 pr-md-0">
                    <div class="bg-secondary text-light h-100 sm-p-30 p-5">
                        <h2 class="text-white mb-3">Repeair Your Car at Home</h2>
                        <div class="text-general text-white font-large mb-4">Starting at <span class="text-primary h3">$19.99</span>/ month</div>
                        <p>Arcu facilisis ante natoque a. Sapien justo tempus quam lectus porttitor ornare tristique enim sociosqu montes tellus duis nulla suscipit ultrices. Eget maecenas pretium sollicitudin auctor adipiscing elit. Elementum faucibus.</p>
                        <a href="offer-details.html" class="btn btn-primary">Offer Details</a>
                    </div>
                </div>
                <div class="col-md-6 pl-0 d-none d-md-block">
                    <div class="w-100 h-100 position-relative" style="background-image: url(static/assets/images/thumb/height1.jpg); background-size: cover; background-position: center center;">
                        <span class="p-4 position-absolute bg-primary text-center box-100px d-table top-0 left-0"><i class="fas fa-house-damage text-white fa-3x"></i></span>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="full-row bg-light">
        <div class="container">
            <div class="row">
                <div class="col-md-6 d-none d-md-block pr-0">
                    <div class="w-100 h-100 position-relative" style="background-image: url(static/assets/images/thumb/height1.jpg); background-size: cover; background-position: center center;">
                        <span class="p-4 position-absolute bg-primary text-center box-100px d-table top-0 right-0"><i class="fas fa-house-damage text-white fa-3x"></i></span>
                    </div>
                </div>
                <div class="col-md-6 pl-md-0">
                    <div class="bg-secondary text-light h-100 sm-p-30 p-5">
                        <h2 class="text-white mb-3">Customize Your Vehicles at Home</h2>
                        <div class="text-general text-white font-large mb-4">Starting at <span class="text-primary h3">$199.99</span>/ One time</div>
                        <p>Arcu facilisis ante natoque a. Sapien justo tempus quam lectus porttitor ornare tristique enim sociosqu montes tellus duis nulla suscipit ultrices. Eget maecenas pretium sollicitudin auctor adipiscing elit. Elementum faucibus.</p>
                        <a href="offer-details.html" class="btn btn-primary">Offer Details</a>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="full-row bg-primary py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-9 wow fadeIn" data-wow-delay="100ms" data-wow-duration="1000ms">
                    <h3 class="text-white mb-2">Download Our Corporate Brochure</h3>
                    <p class="text-white">If you interested in out theme don't wait to purchase or call us</p>
                </div>
                <div class="col-md-3 wow fadeIn" data-wow-delay="200ms" data-wow-duration="1000ms">
                    <div class="y-center position-relative d-table ml-auto sm-margin-none text-white"><a href="#" class="btn btn-secondary">Download Now</a></div>
                </div>
            </div>
        </div>
    </div>


    <footer th:replace="_layout/footer :: footer"></footer>

        <a href="#" class="bg-primary text-white hover-bg-primary" id="scroll"><i class="fa fa-angle-up"></i></a>
    </div>

    <!-- Javascripts -->
    <script src="static/assets/js/jquery.min.js"></script>
    <script src="static/assets/js/greensock.js"></script>
    <script src="static/assets/js/layerslider.transitions.js"></script>
    <script src="static/assets/js/layerslider.kreaturamedia.jquery.js"></script>
    <script src="static/assets/js/popper.min.js"></script>
    <script src="static/assets/js/bootstrap.min.js"></script>
    <script src="static/assets/js/bootstrap-select.min.js"></script>
    <script src="static/assets/js/jquery.fancybox.min.js"></script>
    <script src="static/assets/js/owl.js"></script>
    <script src="static/assets/js/wow.js"></script>
    <script src="static/assets/js/mixitup.min.js"></script>
    <script src="static/assets/js/custom.js"></script>

</body>
</html>